<template>
	<view class="container">
		<!-- 收货人信息 -->
		<view class="info-section">
			<view class="section-title">
				<view class="blue-line"></view>
				<text>收货人信息</text>
			</view>
			<view class="input-group">
				<view class="label">收货人：</view>
				<input class="input" type="text" placeholder="请输入姓名" v-model="address.name" />
			</view>
			<view class="input-group">
				<view class="label">联系电话：</view>
				<input class="input" type="text" placeholder="请输入联系方式" v-model="address.phone" />
			</view>
		</view>

		<!-- 收货地址 -->
		<view class="info-section">
			<view class="section-title">
				<view class="blue-line"></view>
				<text>收货地址</text>
			</view>
			<view class="input-group">
				<view class="label">省份：</view>
				<input class="input" type="text" v-model="address.province" />
			</view>
			<view class="input-group">
				<view class="label">区/市：</view>
				<input class="input" type="text" v-model="address.city" />
			</view>
			<view class="input-group">
				<view class="label">县：</view>
				<input class="input" type="text" v-model="address.county" />
			</view>
			<view class="input-group">
				<view class="label">详细地址：</view>
				<input class="input" type="text" v-model="address.detail" />
			</view>
			<view class="input-group">
				<view class="label">数　量：</view>
				<input class="input" type="number" v-model="address.quantity" />
			</view>
			<view class="input-group">
				<view class="label">SKU-CODE</view>
				<input class="input" type="text" v-model="address.skuCode" />
			</view>
			<view class="input-group flex sb">
				<view class="label">粘贴信息：</view>
				<view class="refresh-btn" @tap="parseAddress">解析</view>
			</view>
			<view class="address-textarea">
				<textarea placeholder="请输入代客下单用户信息" v-model="pasteText"></textarea>
			</view>
		</view>

		<!-- 提交按钮 -->
		<view v-if="!sendLoading" class="submit-btn" @tap="submitOrder">提交订单</view>
		<view v-else class="submit-btn" style="background-color: #666;">提交中...</view>
	</view>
</template>

<script>
	import {
		centerCreateOrder
	} from '@/api/extend.js'
	export default {
		data() {
			return {
				sendLoading: false, // 
				options: {},
				address: {
					name: '',
					phone: '',
					province: '',
					city: '',
					county: '',
					detail: '',
					quantity: 1,
					skuCode: ''
				},
				pasteText: ''
			}
		},
		onLoad(options) {
			this.options = options;
			this.address.skuCode = options.v
			this.address.quantity = options.t
		},
		methods: {
			submitOrder() {
				// 验证表单
				if (!this.validateForm()) {
					return;
				}

				this.sendLoading = true;
				// 执行提交订单逻辑
				uni.showLoading({
					title: '提交中...'
				});

				centerCreateOrder({
					user_name: this.address.name,
					tel_number: this.address.phone,
					province_name: this.address.province,
					city_name: this.address.city,
					county_name: this.address.county,
					detail_info: this.address.detail,
					sku_code: this.address.skuCode,
					cart_num: this.address.quantity,
				}).then(res => {
					uni.hideLoading();
					uni.showToast({
						title: res.message,
						icon: 'none'
					})
					this.sendLoading = false;

					this.address = {
						name: '',
						phone: '',
						province: '',
						city: '',
						county: '',
						detail: '',
						quantity: 1,
						skuCode: ''
					}

				}).catch(err => {
					this.sendLoading = false;
					uni.hideLoading();
					uni.showToast({
						title: err,
						icon: 'none'
					});
				})

			},

			// 表单验证
			validateForm() {
				// 检查每个必填字段
				if (!this.address.name.trim()) {
					this.showError('请输入收货人姓名');
					return false;
				}

				if (!this.address.phone.trim()) {
					this.showError('请输入联系电话');
					return false;
				} else if (!/^1[3-9]\d{9}$/.test(this.address.phone)) {
					this.showError('请输入正确的手机号码');
					return false;
				}

				if (!this.address.province.trim()) {
					this.showError('请选择省份');
					return false;
				}

				if (!this.address.city.trim()) {
					this.showError('请选择城市');
					return false;
				}

				if (!this.address.county.trim()) {
					this.showError('请选择区县');
					return false;
				}

				if (!this.address.detail.trim()) {
					this.showError('请输入详细地址');
					return false;
				}

				if (!this.address.quantity || this.address.quantity <= 0) {
					this.showError('数量必须大于0');
					return false;
				}

				if (!this.address.skuCode.trim()) {
					this.showError('SKU编码不能为空');
					return false;
				}

				return true;
			},

			// 显示错误提示
			showError(message) {
				uni.showToast({
					title: message,
					icon: 'none',
					duration: 2000
				});
			},

			parseAddress() {
				if (!this.pasteText.trim()) {
					uni.showToast({
						title: '请先输入需要解析的信息',
						icon: 'none'
					});
					return;
				}

				try {
					// 按逗号或空格分割
					const parts = this.pasteText.split(/[,，\s]+/);

					if (parts.length >= 3) {
						// 提取姓名（第一部分）
						this.address.name = parts[0].trim();

						// 提取手机号（第二部分）
						const phoneMatch = parts[1].match(/1[3-9]\d{9}/);
						if (phoneMatch) {
							this.address.phone = phoneMatch[0];
						}

						// 提取完整地址（第三部分及之后）
						const fullAddress = parts.slice(2).join('');

						// 解析省份
						const provinceMatch = fullAddress.match(/(.*?省)/);
						if (provinceMatch) {
							this.address.province = provinceMatch[1];
						}

						// 解析城市
						const cityMatch = fullAddress.match(/省(.*?市)/);
						if (cityMatch) {
							this.address.city = cityMatch[1];
						}

						// 解析区/县
						const countyMatch = fullAddress.match(/市(.*?[区县])/);
						if (countyMatch) {
							this.address.county = countyMatch[1];
						}

						// 提取详细地址
						const detailMatch = fullAddress.match(/[区县](.*)/);
						if (detailMatch) {
							this.address.detail = detailMatch[1].trim();
						} else {
							// 如果没有匹配到区县后的详细地址，使用整个地址减去省市区
							let detail = fullAddress;
							if (provinceMatch) {
								detail = detail.replace(provinceMatch[0], '');
							}
							if (cityMatch) {
								detail = detail.replace(cityMatch[0], '');
							}
							if (countyMatch) {
								detail = detail.replace(countyMatch[0], '');
							}
							this.address.detail = detail.trim();
						}
					}

					uni.showToast({
						title: '解析成功',
						icon: 'success'
					});
					this.pasteText = ''
				} catch (e) {
					console.error('解析失败:', e);
					uni.showToast({
						title: '解析失败，请检查输入格式',
						icon: 'none'
					});
				}
			}
		}
	}
</script>

<style scoped lang="scss">
	.container {
		padding: 20rpx;
	}

	.info-section {
		background-color: #FFFFFF;
		border-radius: 10rpx;
		padding: 20rpx;
		margin-bottom: 20rpx;
	}

	.section-title {
		font-size: 32rpx;
		color: #333;
		padding: 10rpx 0;
		font-weight: bold;
		display: flex;
		align-items: center;
		margin-bottom: 20rpx;
	}

	.blue-line {
		width: 8rpx;
		height: 30rpx;
		background-color: #3366FF;
		margin-right: 20rpx;
	}

	.input-group {
		display: flex;
		align-items: center;
		padding: 20rpx 0;
		border-bottom: 1rpx solid #EEEEEE;
	}

	.label {
		width: 180rpx;
		font-size: 28rpx;
		color: #333;
	}

	.input {
		flex: 1;
		font-size: 28rpx;
		background-color: #F5F5F5;
		padding: 10rpx 20rpx;
		border-radius: 6rpx;
	}

	.refresh-btn {
		padding: 6rpx 20rpx;
		// background-color: #3366FF;
		border: 1rpx solid #3366FF;
		color: #FFFFFF;
		font-size: 24rpx;
		border-radius: 6rpx;
		color: #3366FF;
	}

	.address-textarea {
		background-color: #F5F5F5;
		border-radius: 6rpx;
		padding: 20rpx;
		margin-top: 20rpx;
	}

	.address-textarea textarea {
		width: 100%;
		height: 150rpx;
	}

	.submit-btn {
		background-color: #FF6633;
		color: #FFFFFF;
		text-align: center;
		padding: 25rpx 0;
		border-radius: 50rpx;
		font-size: 32rpx;
		margin-top: 50rpx;
	}

	.flex {
		display: flex;
	}

	.sb {
		justify-content: space-between;
	}
</style>